/**
* 作者 ：食草狂魔
*
* 日期 ：2017/11/30
*
* 描述 ：目录管理 - 编辑信息资源
*/
<template>
	 <el-container class="is-vertical">
	 	<HeaderBar :menuState="menuState"></HeaderBar>
	 	<BreadCrumb :options="breadOptions" class="breadcreamb"></BreadCrumb>
	 	<el-main class="resMain">
	 		<ModuleBar :title="moduleBarTitle" class="editModule"></ModuleBar>
			<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="220px" class="demo-ruleForm resForm">
				<el-form-item label="信息资源分类 :">
				    <p>{{ dataTypeTitle }}</p>
				</el-form-item>
			  	<el-form-item label="提供方名称及代码 :">
				    <p>{{ userDepartmentTitle }}</p>
				</el-form-item>
			    <el-form-item class="infor" label="信息资源名称 :" prop="name">
			   		<el-input v-model="ruleForm.name"></el-input>
			    </el-form-item>
			    <el-form-item class="infor inforNum" label="信息资源代码 :">
				   	<p>{{ ruleForm.code1 }}</p>
				   	<span>/</span>
				    <el-input v-model="ruleForm.code2" placeholder="000000"></el-input>
				    <span>/</span>
				    <el-input v-model="ruleForm.code3" placeholder="000000"></el-input>
			    </el-form-item>
			  <el-form-item label="信息资源摘要 :" prop="abstracts">
			    <el-input type="textarea" v-model="ruleForm.abstracts"></el-input>
			  </el-form-item>
			  <el-form-item class="infor" label="信息资源格式 :" prop="infoResourcFormatId">
				<el-select v-model="ruleForm.infoResourcFormatId1" placeholder="请选择" @change="resourceFormat1Change">
		            <el-option
		              v-for="item in resourceFormatData1"
		              :label="item.infoResourceFormatName"
		              :value="item.infoResourceFormatId">
		            </el-option>
		        </el-select>
		        <el-select v-model="ruleForm.infoResourcFormatId2" placeholder="请选择">
		            <el-option
		              v-for="item in resourceFormatData2"
		              :label="item.infoResourceFormatName"
		              :value="item.infoResourceFormatId">
		            </el-option>
		        </el-select>
			  </el-form-item>
			  <el-form-item class="infor" label="关联分类 :">
			  	<div>
			  		<el-input v-model="ruleForm.relataionNames" class="elRelation"></el-input>
			  		<!--<el-button type="primary">选择</el-button>-->
			  	</div>
			  </el-form-item>
			  <div class="resources">
				  <el-form-item class="infor" label="数据存储总量 :" prop="storageTotal">
				    <el-input v-model="ruleForm.storageTotal"></el-input>
				    <span class="catalogG">G</span>
				  </el-form-item>
				  <el-form-item class="infor" label="已共享的数据存储量 :" prop="storageShareNum">
				    <el-input v-model="ruleForm.storageShareNum"></el-input>
				    <span class="catalogG">G</span>
				  </el-form-item>
			  </div>
			  <div class="resources">
				  <el-form-item class="infor" label="已开放的数据存储量 :" prop="storageOpenNum">
				    <el-input v-model="ruleForm.storageOpenNum"></el-input>
				    <span class="catalogG">G</span>
				  </el-form-item>
				  <el-form-item class="infor" label="结构化信息记录总数 :" prop="structureRecordTotal">
				    <el-input v-model="ruleForm.structureRecordTotal"></el-input>
				    <span class="catalogG catalogSlip">万条</span>
				  </el-form-item>
			  </div>
			  <div class="resources">
				  <el-form-item class="infor" label="已共享结构化信息记录总数 :" prop="structureRecordShareNum">
				    <el-input v-model="ruleForm.structureRecordShareNum"></el-input>
				    <span class="catalogG catalogSlip">万条</span>
				  </el-form-item>
				  <el-form-item class="infor" label="已开放结构化信息记录总数 :" prop="structureRecordOpenNum">
				    <el-input v-model="ruleForm.structureRecordOpenNum"></el-input>
				    <span class="catalogG catalogSlip">万条</span>
				  </el-form-item>
			  </div>
			  <el-button type="primary" @click="submitForm('ruleForm')"  class="elButton moduleButton elRight">提交</el-button>
			  <el-button @click="resetForm('ruleForm')" type="info" class="elButton">取消</el-button>
			</el-form>
	 	</el-main>
	 </el-container>
</template>

<script>
	import dirAPIs from '../../api/dirAPIs'
    import departmentAPIs from '../../api/departmentAPIs'
    import portalInterfaceAPIs from '../../api/portalInterfaceAPIs'
    import HeaderBar from '../../components/header/Header.vue'
    import BreadCrumb from '../../components/breadcrumb/BreadCrumb.vue'
    import AddCatalogForm from './components/addCatalogForm/AddCatalogForm.vue'
    import ModuleBar from '../../components/modulebar/ModuleBar.vue'

    export default {
    	name:"resources",
      components: {
        HeaderBar,
        BreadCrumb,
        AddCatalogForm,
        ModuleBar
      },
    	data () {
	      return {
	        title: "目录管理--编辑信息资源内容",
	        menuState: '/catalogManage/main',
	        input: '',
	        value:'',
	        moduleBarTitle:"编辑信息资源内容",
	        breadOptions:{
	        	bread:[
              {
                label:"政务数据资源管理系统",
                path:"/"
              },{
                label:"目录管理",
                path:"/catalogManage/main"
              },{
                label:"编辑信息资源内容",
                path:"/catalogManage/resources"
              }
	        	]
	        },
	        resourceFormatData1: [],
            resourceFormatData2: [],
            ruleForm: {
	            dirId:"",//目录id
	            code1:"",//信息资源代码
	            code2:"",//信息资源代码
	            code3:"",//信息资源代码
	            code:"",//信息资源代码
	            name:"",//信息资源名称
	            abstracts:"",//摘要
	            infoResourcFormatId1:"",
	            infoResourcFormatId2:"",
	            infoResourcFormatId:"",//信息资源格式(前两位是种类，后两位是类型：0101)
	            storageTotal:"",//数据存储总量
	            storageShareNum:"",//已共享数据存储总量
	            storageOpenNum:"",//已开放数据存储总量
	            structureRecordTotal:"",//结构化信息记录总数
	            structureRecordShareNum:"",	//已共享结构化记录总数
	            structureRecordOpenNum:"",//已开放结构化记录总数
	            relationCodes:"",//关联分类代码集合(多个使用逗号分隔)
	            token:localStorage.token,
            	infoResourceId: this.$router.history.current.query.infoResourceId
            },
            rules: {
	          name: [
	            { required: true, message: '请填写内容', trigger: 'blur' }
	          ],
	          abstracts: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ],
	          storageTotal: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ],
	          storageShareNum: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ],
	          storageOpenNum: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ],
	          structureRecordTotal: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ],
	          structureRecordShareNum: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ],
	          structureRecordOpenNum: [
	           	{ required: true, message: '请填写内容', trigger: 'blur'},
	          ]
	        },
	        tableOptions: {
	            handleSelectionChange (rows) {
	            }
	        },
	        dialogOptions: {
	            visible: false,
	            title: "添加目录"
	        },
	        userDepartmentTitle:"",
	        dataTypeTitle:""
		  }
	    },
	    mounted: function () {
    		let vm = this,
            pageNo = 1,
            pageSize = 15,
            total = 400,
            tableDataList = [];
            dirAPIs.infoResourceRead({
            	token:localStorage.token,
            	key:vm.$router.history.current.query.infoResourceId
            }).then(({ data }) => {
            	//console.log(data)
            	if(data.code = 10000){
            		vm.ruleForm = data.data
//                debugger
                vm.ruleForm.infoResourcFormatId1 = data.data.firstFormatId
                vm.ruleForm.infoResourcFormatId2 = data.data.secondFormatId
//                debugger
                let code = vm.ruleForm.code.split('/')
                vm.ruleForm.code1 = code[0]
                vm.ruleForm.code2 = code[1]
                vm.ruleForm.code3 = code[2]

            		console.log(vm.ruleForm)
            		vm.loadDataTypeTitle (vm.ruleForm.dirId)
                // 加载数据资源格式列表
                vm.loadResourceFormatData(0)
            	}
            })
	        // 加载数据资源分类头信息
	        vm.loadDataTypeTitle()
	        // 加载当前用户部门信息
	        vm.loadUserDepartment()

		},
    	methods: {
    		// 加载当前用户部门信息
	    	loadUserDepartment () {
	          let vm = this
	          departmentAPIs.getDepartmentNamesContainSuper({
	            token: localStorage.token
	          }).then(({ data }) => {
	          	if(data.code = 10000){
	          		console.log(data)
	          		vm.userDepartmentTitle = `${data.data.departmentNames}_${data.data.departmentCodes}`
	          	}
	          })
	        },
	        // 加载数据资源分类头信息
	    	loadDataTypeTitle (dirId) {
	    	    let vm = this
	    		dirAPIs.getDirNamesContainSuper({
		            token: localStorage.token,
		            infoDirId: dirId
		        }).then(({ data }) => {
		          	console.log(data)
		          	if(data.code = 10000){
		          		vm.dataTypeTitle = data.data
		          	}
		        })
	        },
	    	loadInfoPropertyData (params) {
	    	    let vm = this
	    	    dirAPIs.infoPropertyList(params).then(({ data }) => {
	            if(data.code == 10000) {
	              vm.initTable(data.data, 1, 20, data.total)
	            }
	          })
	        },
	        resourceFormat1Change (val) {
	          let vm = this
	          //vm.ruleForm.infoResourcFormatId2 = ""
	          vm.loadResourceFormatData(val)
	        },
	        // 加载数据资源格式列表
	    	loadResourceFormatData (parentId) {
	    	    let vm = this
	          dirAPIs.infoResourceFormatList({
	            token: localStorage.token,
	            parentId: parentId
	          }).then(({ data }) => {
	    	      if(data.code == 10000){
	              if(parentId != 0){
//	                debugger
	                vm.resourceFormatData2 = data.data
	              }
	              else {
//	                debugger
	                vm.resourceFormatData1 = data.data
                  vm.loadResourceFormatData(vm.ruleForm.infoResourcFormatId1)
	              }
	            }
	          })
	        },
	    	submitForm(formName) {
	    		let vm  = this
		        vm.$refs.ruleForm.validate((valid) => {
		          if (valid) {
		          	if(vm.ruleForm.code2.length ==0 || vm.ruleForm.code3.length == 0){
		          		vm.$message.warning("请填写信息资源代码")
		          	}else if(vm.ruleForm.infoResourcFormatId2.length == 0){
		          		vm.$message.warning("请选择信息资源格式")
		          	}else{
		          		vm.ruleForm.code = `${vm.ruleForm.code1}/${vm.ruleForm.code2}/${vm.ruleForm.code3}`
		//          		vm.ruleForm.code = vm.ruleForm.code1
		            	vm.ruleForm.infoResourcFormatId = vm.ruleForm.infoResourcFormatId2
		            	vm.ruleForm.token = localStorage.token
		            	vm.ruleForm.infoResourceId = this.$router.history.current.query.infoResourceId

			            dirAPIs.infoResourceUpdate(vm.ruleForm).then(({ data }) => {
				            if(data.code == 10000){
		                		this.$router.push({path: '/catalogManage/main'})
				            }
				        })
		          	}
		          } else {
		            console.log('error submit!!');
		            return false;
		          }
		        });

		    },
		    resetForm(formName) {
                this.$router.push({path: '/catalogManage/main'});
		        this.$refs[formName].resetFields();
		    }
    	}
    }
</script>

<style>
	.resMain{
		width: 75%;
		line-height: normal;
		margin: 0 auto 90px;
	}
	/*.resMain .resStep .el-step__arrow{
		display: none;
	}*/
	.resStep{
		padding: 0 8%;
		height: 40px;
	}
	.resForm{
		padding: 60px 10% 0 10%;
		border: 1px solid #d8d6d6;
		border-top: none;
	}
	.resForm label{
		font-weight: bold;
	}
	.resForm .el-form-item__content{
		margin-left: 220px !important;
		text-align: left;
	}
	.resForm .el-textarea__inner{
		min-height: 140px !important;
	}
	.resources{
		overflow: hidden;
	}
	.resources .infor{
		width: 50%;
		float: left;
		position: relative;
	}
	.resForm .elRelation{
		width: auto;
	}
	.resources .el-input__inner{
		height: 36px;
	}
	.catalogG{
		width: 36px;
		height: 36px;
		color:#fff;
		display: block;
		font-size: 1.6rem;
		background: #2cace2;
		border-radius: 3px;
		text-align: center;
		line-height: 36px;
		position: absolute;
		top: 4px;
		right: 0;
	}
	.catalogSlip{
		width: 50px;
	}
	.resForm .elButton,.editMain .elButton{
		margin: 40px 0 60px 0;
		width: 112px;
		height: 36px;
	}
	.resForm .elRight,.editMain .elRight{
		margin-right: 60px;
	}
	.inforNum{
		overflow: hidden;
	}
	.inforNum p{
		float: left;
	}
	.inforNum .el-input{
		float: left;
		width: 140px;
	}
	.inforNum span{
		float: left;
	}
	.resForm .el-select{
		float: left;
		width: 140px;
		margin-right: 10px;
	}
	.toolbarItem button{
		width: 84px;
		height: 36px;
	}
	.resMain .editModule{
		width: 100%;
		text-align: center;
	}
</style>
